import React from "react";

import PageContent from '../PageContent'

import { ajax ,showResultMessage} from '../common';

import {UIDataTableView,UIDataTreeView} from '../uicomponents/UIDataComponentView';

import UIFormView from '../uicomponents/UIFormView';

/**
 * 系统角色管理
*/
export default class SysRoleManageApp extends React.Component {
	render() {
		return (
			<PageContent {...this.props} pageInstance={this} >
				<SysRoleListPanle />
			</PageContent>
		);
	}
}

/** 
 * 系统角色列表
*/
class SysRoleListPanle extends React.Component {

	constructor(props) {
		super(props);
		this.state = {
			title: '',
			disabledFileds: {},
			sysRoleModuleUrl: null,
		}
	}


	actionHandler = (actionEvent) => {
		const { tableRef, sysRoleFormRef, sysRoleConfigRef, selectSysRoleIds } = this;
		return {
			refresh: () => {
				tableRef.loadData();
			},
			addSysRole: () => {
				this.setState({ title: '新增系统角色', disabledFileds: { 'domainId': false } });
				setTimeout(() => {
					sysRoleFormRef.openModal();
				});
			},
			editSysRole: () => {
				this.setState({ title: '编辑系统角色', disabledFileds: { 'domainId': true } });
				setTimeout(() => {
					sysRoleFormRef.openModal(() => {
						sysRoleFormRef.setFormData(actionEvent.params);
					});
				});
			},
			closeDialog: () => {
				sysRoleFormRef.closeModal();
			},
			doOk: () => {
				sysRoleFormRef.getFormData((formData) => {
					const result = {};
					formData.type = 'ROLE';
					ajax('SYSTEM/SYSROLE/saveSysRole', formData).then((data) => {
						if (data) {
							result.success = true;
							result.message = 'message.saveSuccess';
							sysRoleFormRef.closeModal();
							tableRef.loadData();
						}
					}).catch(function (reason) {
						result.success = false;
						result.message = reason;
					}).finally(() => {
						//console.log(result);
						showResultMessage(result);
					});
				});
			},
			deleteSysRoles: () => {
				const result = {};
				ajax('SYSTEM/SYSROLE/deleteSysRole', { ids: actionEvent.params != null ? [actionEvent.params.id] : selectSysRoleIds }, (data) => {
					result.success = true;
					result.message = 'message.deleteSuccess';
					tableRef.loadData();
					showResultMessage(result);
				});
			},
			configSysRole: () => {
				this.selectSysRole = actionEvent.params;
				this.setState({ sysRoleModuleUrl: 'SYSTEM/sysRolePurViewModuleTree/buildTree/' + actionEvent.params.id });
				setTimeout(() => {
					sysRoleConfigRef.openModal();
				});
			}
		}
	}

	sysRoleConfigActionHandler = (actionEvent) => {
		const { sysRoleConfigRef, selectSysRole, ckechedSysModuleNodes } = this;
		return {
			closeDialog: () => {
				sysRoleConfigRef.closeModal();
			},
			doOk: () => {
				const checkedModuleIds = ckechedSysModuleNodes.map((node) => {
					return node.props.dataRef.nodeData.id
				});

				ajax('SYSTEM/SYSROLE/saveSysRolePurView', { roleId: selectSysRole.id, moduleIds: checkedModuleIds.join(','),actionIds : '' }, (data) => {
					sysRoleConfigRef.closeModal();
				});
			}
		};
	}

	onSysRoleModuleCheckChange = (checkedKeys, e) => {
		this.ckechedSysModuleNodes = e.checkedNodes;
	}

	render() {

		const sysRoleTableProps = {
			tableConfigId: 'sysRoleTable',
			selectMode: 'multi',
			dataUrl: 'SYSTEM/SYSROLE/querySysRoleList',
			actionGroupId: 'sysRoleListActionGroup',
			rowActionGroupId: 'sysRoleRowActionGroup',
			searchFormId: 'sysRoleQueryForm',
			autoLoad: true,
			actionHandler: this.actionHandler,
			onSelectChange: (selectRowKeys) => {
				this.selectSysRoleIds = selectRowKeys;
			},
			ref: (inst) => {
				this.tableRef = inst;
			},
			setToolbarState: (topToolBar, selectedIds) => {
				if (selectedIds != null && selectedIds.length > 0) {
					topToolBar.enable('delete');
				}
				else {
					topToolBar.disable('delete');
				}
			}

		};

		const sysRoleEditFormProps = {
			formConfigId: 'sysRoleInfoEditForm',
			inPop: true,
			title: this.state.title,
			disabledFileds: this.state.disabledFileds,
			actionGroupId: 'defaultDiaoligActionGroup',
			destroyOnClose: true,
			actionHandler: this.actionHandler,
			ref: (inst) => { this.sysRoleFormRef = inst },
		};

		const sysRoleConfigProps = {
			ref: (inst) => { this.sysRoleConfigRef = inst },
			style : { height: '300px', overflow: 'auto' },
			inPop: true,
			title: '设置角色权限',
			checkable: true,
			destroyOnClose: true,
			actionHandler: this.sysRoleConfigActionHandler,
			actionGroupId: 'defaultDiaoligActionGroup',
			dataUrl: this.state.sysRoleModuleUrl,
			expandLevel: - 1,
			checkStrictly : true,
			onCheck: this.onSysRoleModuleCheckChange
		};

		return (
			<React.Fragment>
				<UIDataTableView {...sysRoleTableProps} />
				<UIFormView  {...sysRoleEditFormProps} />
				<UIDataTreeView {...sysRoleConfigProps} />
			</React.Fragment >
		);
	}
}